WWL.thumbviewer = function ( name, attrs )
{
	var thumbviewer = WWL.get_instance ( 'thumbviewer', name );

	if ( ! thumbviewer )
        	thumbviewer = new WWL ( 'thumbviewer', name );

	thumbviewer.init = function ()
	{
		//container div details
		thumbviewer.cnt_width = thumbviewer._class.cnt_width;
		thumbviewer.cnt_height = thumbviewer._class.cnt_height;
		thumbviewer.cnt_type = thumbviewer._class.cnt_type;
		//single item details
		thumbviewer.thumbs_w_full = thumbviewer._class.thumbs_w_full;
		thumbviewer.thumbs_h_full = thumbviewer._class.thumbs_h_full;
		thumbviewer.thumbs_spacing = thumbviewer._class.thumbs_spacing;
		thumbviewer.thumbs_spacing_v = thumbviewer._class.thumbs_spacing_v;
	};

	if ( ! thumbviewer._class || ! thumbviewer._class instanceof TV )
	{
		if ( ! attrs ) attrs = {};
		attrs [ 'dest_div' ] = thumbviewer._dest_id;
		thumbviewer.tv_id = 'tv:' + thumbviewer.id;
		thumbviewer._class = new TV ( thumbviewer.tv_id, attrs );
		thumbviewer._class.init ();
		thumbviewer.init ();
	}

	//FIXME: html_id is NOT optional	
	thumbviewer.render = function ( html_id )
	{
		if ( this.cbacks [ 'pre-render' ] && ( this.cbacks [ 'pre-render' ] ( this ) ) ) return;

		var s = '', id;
		var el;

		this._rendered = false;

		if ( ! html_id ) html_id = this._dest_id;
		this._dest_id = $el ( html_id );

		if ( html_id )
		{
			// Ho l'id giusto
			el = this._dest_id;

			if ( ! el )
			{
				console.error ( "ERROR: element with id: '" + this._dest_id + "' does not exists" );
				return;
			}
		} else {
			// No HTML ID e no dest_id
			if ( ! this.id )
			{
				console.error ( "ERROR: element %s does not have dest_id or this.id", this.name );
				return;
			}
			el = document.getElementById ( this.id );

			if ( ! el ) return;

			el = el.parentNode;
		}

		//el.innerHTML = this.to_string ();
		thumbviewer._class.dest_div = el.id; 
		thumbviewer._class.render ();
		this._rendered = true;

		if ( this.cbacks [ 'render' ] ) this.cbacks [ 'render' ] ( this );
	};

	thumbviewer.close = function ()
	{
		//return last position before closing
		return this._class.close ();
	};

	thumbviewer.clear = function ()
	{
		this._class.clear ();
	};

        thumbviewer.get_config = function ()
        {
		return this._class.get_config ();
        };

        thumbviewer.set_config = function ( css_files, classes, class_prefix )
        {
		this._class.set_config ( css_files, classes, class_prefix );
		this.init ();
        };

        thumbviewer.set_cbacks = function ( ev, cback )
        {
                this._class.cbacks [ ev ] = cback;
        };

        thumbviewer.set_dest_div = function ( dest_div )
        {
                this._class.dest_div = dest_div;
        };

        thumbviewer.set_start_pos = function ( start_pos )
        {
                this._class.start_pos = start_pos;
        };

	thumbviewer.add_item = function ( item )
	{
		thumbviewer._class.add_item ( item );
	};

	thumbviewer.move_right = function ()
	{
		thumbviewer._class.move_right ();
	};

	thumbviewer.move_left = function ()
	{
		thumbviewer._class.move_left ();
	};

	thumbviewer.render_thumbs = function ( start_pos, sliced )
	{
		 thumbviewer._class.render_thumbs ( start_pos, sliced );
	};

	return thumbviewer;
};
